<template>
  <list
      v-model="searchParams"
      :headers="headers"
      isHasOperateColumn
      :searchUrl="data.searchUrl"
      ref="listRef"
  >
    <template #operateBtnsSlot>
    </template>
    <template #operateSlot="scope">
      <v-button type="danger" @click="deleteHandle(scope.row)" text="删除"
                v-permission="`btn.FeedBack.remove`"/>
    </template>
    <template #searchSlot>
      <v-input label="内容" v-model="searchParams.content"/>
    </template>
  </list>
</template>

<script lang="ts" setup>
import {inject, reactive, ref} from "vue";
import {deleteFeedBackApi} from "@/api/feedBack";

let $messageBox: any = inject('$messageBox')
let $message: any = inject('$message')

let searchParams = ref({
  content: ''
})

const data = reactive({
  searchUrl: '/feedBack/list',
  isShowDrawer: false,
})

const listRef = ref()

const headers = reactive<TableHeader[]>([
  {
    prop: 'content',
    label: '反馈内容'
  },
  {
    prop: 'createdUserName',
    label: '反馈人姓名'
  },
  {
    prop: 'createdTime',
    label: '反馈时间'
  },
  {
    prop: 'source',
    label: '反馈来源',
    formatter: (row) => {
      switch (row.source) {
        case 'weixin':
          return '微信小程序'
        case 'zfb':
          return '支付宝小程序'
        default:
          return '微信小程序'
      }
    }
  }
])

const deleteHandle = (row) => {
  $messageBox.confirm(
      `确定删除这条反馈吗？`,
      '警告',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }
  ).then(() => {
    deleteFeedBackApi(row.id).then(res => {
      if (res.status === 0) {
        $message.success('删除成功')
        listRef.value.searchData()
      } else {
        $message.error('删除失败')
      }
    })
  })
}
</script>

<style scoped>

</style>
